﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="MapBaidu.aspx.cs" Inherits="Map_MapBaidu" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <style type="text/css">  
         html{height:100%}   body{height:100%;margin:0px;padding:0px}   #container{height:100%}   
    </style>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=1.4"></script>
    <script src="../Resources/Scripts/jQuery/jquery-1.7.1.js" type="text/javascript"></script>
    <script type="text/javascript">

        $(function () {

            createMap(114.519983, 37.293362); //113.661717,34.760406
            setMapEvent();
            addMapControl();

//            var map = new BMap.Map("container"); // 创建地图实
//            var point = new BMap.Point(113.628947, 34.755186);  // 创建点坐标
//            map.centerAndZoom(point, 8);  // 初始化地图，设置中心点坐标和地图级别
//            map.enableScrollWheelZoom();
//            getBoundary("河南省");

//            $.post("MapHelper.ashx", { "action": "GetCityName" }, function (data, status) {
//                if (data == "err") {
//                    alert("加载错误");
//                }
//                else {
//                    var city = $.parseJSON(data);
//                    //$("#city").empty();
//                    for (var i = 0; i < city.length; i++) {
//                        var option = "<option value=" + city[i].OrganID + " >--" + city[i].Name + "--</option>";
//                        $("#city").append(option);
//                    }
//                    // alert(city[0].OrganID);
//                }

//            });

//            $("#city").change(function () {
//                var value = $("#city").val();

//                var name = $("#city").find("option:selected").text();
//                getBoundary(name);


//                $.post("MapHelper.ashx", { "action": "GetMapData", "name": name, "value": value }, function (data, status) {
//                    alert(data);

//                });
//            });


        })


        //创建地图函数
        function createMap(lng, lat) {
            var map = new BMap.Map("container"); //在页面容器中创建一个地图
            var point = new BMap.Point(lng, lat); //定义一个中心点的坐标
            //  map.centerAndZoom(point, 9); //设定地图的中心点和坐标并将地图显示在地图容器中
            window.map = map; //将map设为全局变量
            getBoundary("内丘县");
            map.centerAndZoom(point, 8);
            // addMarker(point, 10);
            //map.setZoom(50);

        }

        //地图事件设置函数
        function setMapEvent() {
            map.enableDragging(); // 启用地图拖拽事件
            map.enableScrollWheelZoom(); //启用地图滚轮放大缩小
            map.enableDoubleClickZoom(); //启用地图双击放大事件
            map.enableKeyboard(); //启用键盘上下左右键移动地图
        }

        //地图控件添加函数：
        function addMapControl() {
            //向地图中添加缩放控件
            var ctrl_nav = new BMap.NavigationControl();
            map.addControl(ctrl_nav);
            //向地图中添加缩略图控件
            var ctrl_ove = new BMap.OverviewMapControl();
            map.addControl(ctrl_ove);
            //向地图中添加比例尺控件
            var ctrl_sca = new BMap.ScaleControl();
            map.addControl(ctrl_sca);
        }

        //取得一个行政区域的边界
            function getBoundary(name) {
                var bdary = new BMap.Boundary();

                //var name = document.getElementById("districtName").value;
                bdary.get(name, function (rs) {       //获取行政区域
                    map.clearOverlays();        //清除地图覆盖物       
                    var count = rs.boundaries.length; //行政区域的点有多少个
                    for (var i = 0; i < count; i++) {
                        var ply = new BMap.Polygon(rs.boundaries[i], { strokeWeight: 2, strokeColor: "#ff0000" }); //建立多边形覆盖物
                        ply.setFillColor();
                        map.addOverlay(ply);  //添加覆盖物
                        map.setViewport(ply.getPath());    //调整视野         
                    }
                });
            }

       
    </script>
</head>
<body >
    <form runat="server">
    <div>
          <select id="city" runat="server" >
           <option value="">--请选择--</option>
          </select> 
    </div>
   
    </form>
     <div id="container"></div>
</body>
</html>
